<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>360商城</title>
    <link rel="shortcut icon" href="./imgs/360icon.ico" type="image/x-icon">
    <link rel="stylesheet" href="./css/index.css">
    <link rel="stylesheet" href="./lib/swiper.css">
    <link rel="stylesheet" href="./font/iconfont.css">
</head>
<body>

    <div class="header">
        <div class="index_mask">
            <div class="login">
                <button class="close_btn iconfont iconshanchu"></button>
                <div class="login_top">
                    <h3><span class="cur_style">短信登录</span>|<span>360账号登录</span></h3>
                    <div class="mes">
                        <input type="text" value="" placeholder="手机号">
                        <div>
                            <input type="text" name="" placeholder="验证码"><input type="button" value="获取验证码">
                        </div>
                    </div>
                    <div class="count360">
                        <input type="text"  placeholder="手机号/用户名/邮箱">
                        <input type="password" placeholder="密码">
                    </div>
                </div>
                <form class="login_box">
                    <input type="button" value="登录" class="accout_login">
                    <div class="login_tool">
                        <a href="javascript:void(0);" class="btn_reg">快速注册</a>
                        <a href="javascript:void(0);">找回密码</a>
                    </div>
                </form>
            </div>
            <div class="register">
                <button class="close_btn iconfont iconshanchu"></button>
                <div class="register_top">
                    <h3><span>手机号注册</span></h3>
                    <div class="ipt_out">
                        <i class="iconfont iconshouji"></i><input type="tel" name="" placeholder="手机号">
                    </div>
                    <div class="code_test">
                        <div class="ipt_out">
                            <i class="iconfont iconyanzhengma"></i><input type="text" placeholder="验证码">
                        </div>
                        <img src="./imgs/code1.png" alt="">
                    </div>
                    <div class="ipt_out mes_out">
                        <i class="iconfont iconduanxin"></i><input type="text" name="" placeholder="短信验证码"><input type="button" value="获取验证码">
                    </div>
                    <div class="ipt_out">
                        <i class="iconfont iconmimasuo"></i><input type="password" name="" placeholder="密码（8-20个字符）">
                    </div>
                    <p><input type="checkbox" name="" >阅读并同意<a href="">《360用户条款》</a>和<a href="">《360隐私政策》</a></p>
                </div>
                <form class="register_box">
                    <input type="button" value="注册">
                    <div class="register_tool">
                        <span>已有账号？</span>
                        <a href="javascript:void(0);" class="btn_login">点击登录</a>
                    </div>
                </form>
            </div>
        </div>
        <div class="header_inner main">
            <ul class="header_left">
                <li><a href="#">帮助中心</a></li>
                <li><a href="#">收藏</a></li>
                <li><a href="https://www.360.cn/">360官网</a></li>
                <li><a href="#">360智慧生活</a></li>
            </ul>
            <ul class="header_right">
                <li id="login"><a href="javascript:void(0);">登录</a></li>
                <li id="register"><a href="javascript:void(0);">注册</a></li>
                <!-- <div id="loginout"><a href="javascript:void(0);">退出登录</a></div> -->
                <div id="loginUser">
                    <div class="userName"><a href="javascript:void(0);">用户哈哈哈</a></div>
                    <ul class="userInfo">
                        <div><a href="javascript:void(0);">我的会员</a></div>
                        <div><a href="javascript:void(0);">我的收藏</a></div>
                        <div><a href="javascript:void(0);">我的会员</a></div>
                        <div><a href="javascript:void(0);">收货地址</a></div>
                        <div id="loginout"><a href="javascript:void(0);">退出登录</a></div>
                    </ul>
                </div>
                <li><a href="javascript:void(0);">360手机商城
                    <div class="qrcode">
                        <img src="./imgs/1.jpg" alt="">
                        <p>扫码下载<br>App</p>
                    </div>
                </a></li>
                <li class="bag"><a href="javascript:void(0);" class="iconfont icongouwucheicon">
                    <div class="minicart">
                        您的购物车还没有商品，赶紧去选购吧！
                    </div>
                </a></li>
            </ul>
        </div>
    </div>
    <div class="headbox">
        <div class="headbox_inner main">
            <h1 id="logo"><a href="javascript:void(0);"><img src="./imgs/logo_03.png" alt=""></a></h1>
            <ul class="head_nav">
                <li><a href="#">新品推荐</a></li>
                <li><a href="#">热卖榜单</a></li>
                <li><a href="#">发现好物</a></li>
            </ul>
            <div class="head_right">
                <form class="search">
                    <input type="text" name="" id="">
                    <label for="rs"><input type="submit" value="" id="rs"></form></label>
                </form>
                <ul>
                    <li><a href="#">记录仪</a></li>
                    <li><a href="#">摄像机</a></li>
                    <li><a href="#">路由器</a></li>
                    <li><a href="#">扫地机</a></li>
                    <li><a href="#">耳机</a></li>
                    <li><a href="#">智能手表</a></li>
                    <li><a href="#">品牌优惠</a></li>
                </ul>
            </div>
        </div>
    </div>
    <div class="banner">
        <div class="swiper-container">
            <div class="swiper-wrapper">
              <div class="swiper-slide"><img src="./imgs/2.jpg" alt=""></div>
              <div class="swiper-slide"><img src="./imgs/3.jpg" alt=""></div>
              <div class="swiper-slide"><img src="./imgs/4.jpg" alt=""></div>
              <div class="swiper-slide"><img src="./imgs/5.jpg" alt=""></div>
              <div class="swiper-slide"><img src="./imgs/6.jpg" alt=""></div>
            </div>
            <div class="swiper-pagination"></div>
             </div>
        <div class="catagory">
            <div class="catagory_inner main">
                <ul class="catalist">
                    <li class="catalist_all">
                        <a href="javascript:void(0);">
                            <i class="iconfont iconfenlei"></i>
                            全部分类</a>
                    </li>
                    <li class="catalist_item">家庭安防
                        <div class="item_content">
                           
                        </div>
                    </li>
                    <li class="catalist_item">安全路由
                        <div class="item_content">
                       
                        
                    </div></li>
                    <li class="catalist_item">智能手表<div class="item_content">
                        <!-- <div class="catagood">
                            <img src="./imgs/21.jpg" alt="">
                            <span>云记录卡</span>
                        </div>
                        <div class="catagood">
                            <img src="./imgs/22.jpg" alt="">
                            <span>云记录卡v2</span>
                        </div>
                        <div class="catagood">
                            <img src="./imgs/23.jpg" alt="">
                            <span>储存卡-16G</span>
                        </div>
                        <div class="catagood">
                            <img src="./imgs/24.jpg" alt="">
                            <span>储存卡-32G</span>
                        </div>
                        <div class="catagood">
                            <img src="./imgs/25.jpg" alt="">
                            <span>储存卡-64G</span>
                        </div> -->
                    </div></li>
                    <li class="catalist_item">汽车用品<div class="item_content">
                       
                        
                    </div></li>
                    <li class="catalist_item">扫地机器人<div class="item_content">
                       
                    </div></li>
                    <li class="catalist_item">影音生活<div class="item_content">
                        
                    </div></li>
                    <li class="catalist_item">生态产品<div class="item_content">
                       
                    </div></li>
                    <li class="catalist_item">数码配件<div class="item_content">
                    </div></li>
                </ul>
                <div class="swiper-button-prev"></div><!--左箭头。如果放置在swiper-container外面，需要自定义样式。-->
                <div class="swiper-button-next"></div><!--右箭头。如果放置在swiper-container外面，需要自定义样式。-->
            </div>
        </div>
    </div>
    <div class="container">
        <div class="container_inner main">
            <ol class="activity">
                <h2 class="base_title" id="hot-activity">热门活动<i class="iconfont iconright-circle-fill"></i></h2>
                <ul class="clear_fix">
                    <li class="base_up"><img src="./imgs/81.jpg" alt=""></li>
                    <li class="base_up"><img src="./imgs/82.jpg" alt=""></li>
                    <li class="base_up"><img src="./imgs/83.jpg" alt=""></li>
                    <li class="base_up"><img src="./imgs/84.jpg" alt=""></li>
                </ul>
                <div class="base_img"><img src="./imgs/new01.jpg" alt=""></div>
            </ol>
            <ol class="spike">
                <h2 class="base_title">限时秒杀<i class="iconfont iconshandian"></i></h2>
                <ul class="clear_fix">
                    <div class="base_up spike_left">
                        <a href="#">
                            <img src="./imgs/85.jpg" alt="">
                        </a>
                    </div>
                    <div class="spike_right">
                        <li class="spike_item base_up">
                            <img src="./imgs/129.jpg" alt="">
                            <div class="spike_item_txt">
                                <h3>360 PopBuds SE真无线蓝牙耳机音乐 主副耳机自由切换</h3>
                                <h4>￥169<del>￥388</del></h4>
                                <button>马上抢</button>
                            </div>
                        </li> 
                        <li class="spike_item base_up">
                            <img src="./imgs/101.jpg" alt="">
                            <div class="spike_item_txt">
                                <h3>360 家庭防火墙路由器V5P</h3>
                                <h4>￥169<del>￥388</del></h4>
                                <button>马上抢</button>
                            </div>
                        </li>
                        <li class="spike_item base_up">
                            <img src="./imgs/129.jpg" alt="">
                            <div class="spike_item_txt">
                                <h3>360 PopBuds SE真无线蓝牙耳机音乐 主副耳机自由切换</h3>
                                <h4>￥169<del>￥388</del></h4>
                                <button>马上抢</button>
                            </div>
                        </li> 
                        <li class="spike_item base_up">
                            <img src="./imgs/101.jpg" alt="">
                            <div class="spike_item_txt">
                                <h3>360 家庭防火墙路由器V5P</h3>
                                <h4>￥169<del>￥388</del></h4>
                                <button>马上抢</button>
                            </div>
                        </li>
                    </div>
                </ul>
                <div class="base_img"><img src="./imgs/new02.jpg" alt=""></div>
            </ol>
            <ol class="sweep common_list">
                <h2 class="base_title">扫地机器人<i class="iconfont iconright-circle-fill"></i></h2>
                <ul class="clear_fix">
                    <!-- <li class="base_up">
                        <img src="./imgs/111.jpg" alt="">
                    </li>
                    <li class="base_up">
                        <div class="img_outer">
                            <img src="./imgs/112.jpg" alt="">
                        </div>
                        <div class="good_dsc"><h2>360扫地机器人X95礼盒版</h2>
                        <h3>2650Pa大吸力 清扫省时高效</h3>
                        <p>￥2588<del>￥3688</del></p>
                        </div>
                    </li>
                    <li class="base_up">
                        <div class="img_outer">
                            <img src="./imgs/113.jpg" alt="">
                        </div>
                        <div class="good_dsc"><h2>360扫地机器人X95礼盒版</h2>
                        <h3>2650Pa大吸力 清扫省时高效</h3>
                        <p>￥2588<del>￥3688</del></p>
                        </div>
                    </li>
                    <li class="base_up">
                        <div class="img_outer">
                            <img src="./imgs/114.jpg" alt="">
                        </div>
                        <div class="good_dsc"><h2>360扫地机器人X95礼盒版</h2>
                        <h3>2650Pa大吸力 清扫省时高效</h3>
                        <p>￥2588<del>￥3688</del></p>
                        </div>
                    </li>
                    <li class="base_up">
                        <div class="img_outer">
                            <img src="./imgs/115.jpg" alt="">
                        </div>
                        <div class="good_dsc"><h2>360扫地机器人X95礼盒版</h2>
                        <h3>2650Pa大吸力 清扫省时高效</h3>
                        <p>￥2588<del>￥3688</del></p>
                        </div>
                    </li>
                    <li class="base_up">
                        <div class="img_outer">
                            <img src="./imgs/116.jpg" alt="">
                        </div>
                        <div class="good_dsc"><h2>360扫地机器人X95礼盒版</h2>
                        <h3>2650Pa大吸力 清扫省时高效</h3>
                        <p>￥2588<del>￥3688</del></p>
                        </div>
                    </li>
                    <li class="base_up">
                        <div class="img_outer">
                            <img src="./imgs/117.jpg" alt="">
                        </div>
                        <div class="good_dsc"><h2>360扫地机器人X95礼盒版</h2>
                        <h3>2650Pa大吸力 清扫省时高效</h3>
                        <p>￥2588<del>￥3688</del></p>
                        </div>
                    </li> -->
                </ul>
                <div class="base_img"><img src="./imgs/new04.jpg" alt=""></div>
            </ol>
            <ol class="inter common_list">
                <h2 class="base_title">智能互联<i class="iconfont iconright-circle-fill"></i></h2>
                <ul class="clear_fix">
                    <li class="base_up">
                        <img src="./imgs/125.jpg" alt="">
                    </li>
                    <li class="base_up">
                        <div class="img_outer">
                            <img src="./imgs/126.jpg" alt="">
                        </div>
                        <div class="good_dsc"><h2>360扫地机器人X95礼盒版</h2>
                        <h3>2650Pa大吸力 清扫省时高效</h3>
                        <p>￥2588<del>￥3688</del></p>
                        </div>
                    </li>
                    <li class="base_up">
                        <div class="img_outer">
                            <img src="./imgs/127.jpg" alt="">
                        </div>
                        <div class="good_dsc"><h2>360扫地机器人X95礼盒版</h2>
                        <h3>2650Pa大吸力 清扫省时高效</h3>
                        <p>￥2588<del>￥3688</del></p>
                        </div>
                    </li>
                    <li class="base_up">
                        <div class="img_outer">
                            <img src="./imgs/128.jpg" alt="">
                        </div>
                        <div class="good_dsc"><h2>360扫地机器人X95礼盒版</h2>
                        <h3>2650Pa大吸力 清扫省时高效</h3>
                        <p>￥2588<del>￥3688</del></p>
                        </div>
                    </li>
                    <li class="base_up">
                        <div class="img_outer">
                            <img src="./imgs/129.jpg" alt="">
                        </div>
                        <div class="good_dsc"><h2>360扫地机器人X95礼盒版</h2>
                        <h3>2650Pa大吸力 清扫省时高效</h3>
                        <p>￥2588<del>￥3688</del></p>
                        </div>
                    </li>
                    <li class="base_up">
                        <div class="img_outer">
                            <img src="./imgs/130.jpg" alt="">
                        </div>
                        <div class="good_dsc"><h2>360扫地机器人X95礼盒版</h2>
                        <h3>2650Pa大吸力 清扫省时高效</h3>
                        <p>￥2588<del>￥3688</del></p>
                        </div>
                    </li>
                    <li class="base_up">
                        <div class="img_outer">
                            <img src="./imgs/131.jpg" alt="">
                        </div>
                        <div class="good_dsc"><h2>360扫地机器人X95礼盒版</h2>
                        <h3>2650Pa大吸力 清扫省时高效</h3>
                        <p>￥2588<del>￥3688</del></p>
                        </div>
                    </li>
                </ul>
                <div class="base_img"><img src="./imgs/new05.jpg" alt=""></div>
            </ol>
            <ol class="home common_list">
                <h2 class="base_title">家庭安防<i class="iconfont iconright-circle-fill"></i></h2>
                <ul class="clear_fix">
                    <li class="base_up">
                        <img src="./imgs/90.jpg" alt="">
                    </li>
                    <li class="base_up">
                        <div class="img_outer">
                            <img src="./imgs/126.jpg" alt="">
                        </div>
                        <div class="good_dsc"><h2>360扫地机器人X95礼盒版</h2>
                        <h3>2650Pa大吸力 清扫省时高效</h3>
                        <p>￥2588<del>￥3688</del></p>
                        </div>
                    </li>
                    <li class="base_up">
                        <div class="img_outer">
                            <img src="./imgs/91.jpg" alt="">
                        </div>
                        <div class="good_dsc"><h2>360扫地机器人X95礼盒版</h2>
                        <h3>2650Pa大吸力 清扫省时高效</h3>
                        <p>￥2588<del>￥3688</del></p>
                        </div>
                    </li>
                    <li class="base_up">
                        <div class="img_outer">
                            <img src="./imgs/92.jpg" alt="">
                        </div>
                        <div class="good_dsc"><h2>360扫地机器人X95礼盒版</h2>
                        <h3>2650Pa大吸力 清扫省时高效</h3>
                        <p>￥2588<del>￥3688</del></p>
                        </div>
                    </li>
                    <li class="base_up">
                        <div class="img_outer">
                            <img src="./imgs/93.jpg" alt="">
                        </div>
                        <div class="good_dsc"><h2>360扫地机器人X95礼盒版</h2>
                        <h3>2650Pa大吸力 清扫省时高效</h3>
                        <p>￥2588<del>￥3688</del></p>
                        </div>
                    </li>
                    <li class="base_up">
                        <div class="img_outer">
                            <img src="./imgs/94.jpg" alt="">
                        </div>
                        <div class="good_dsc"><h2>360扫地机器人X95礼盒版</h2>
                        <h3>2650Pa大吸力 清扫省时高效</h3>
                        <p>￥2588<del>￥3688</del></p>
                        </div>
                    </li>
                    <li class="base_up">
                        <div class="img_outer">
                            <img src="./imgs/95.jpg" alt="">
                        </div>
                        <div class="good_dsc"><h2>360扫地机器人X95礼盒版</h2>
                        <h3>2650Pa大吸力 清扫省时高效</h3>
                        <p>￥2588<del>￥3688</del></p>
                        </div>
                    </li>
                </ul>
                <div class="base_img"><img src="./imgs/new04.jpg" alt=""></div>
            </ol>
            <ol class="car common_list">
                <h2 class="base_title">行车安全<i class="iconfont iconright-circle-fill"></i></h2>
                <ul class="clear_fix">
                    <li class="base_up">
                        <img src="./imgs/104.jpg" alt="">
                    </li>
                    <li class="base_up">
                        <div class="img_outer">
                            <img src="./imgs/105.jpg" alt="">
                        </div>
                        <div class="good_dsc"><h2>360扫地机器人X95礼盒版</h2>
                        <h3>2650Pa大吸力 清扫省时高效</h3>
                        <p>￥2588<del>￥3688</del></p>
                        </div>
                    </li>
                    <li class="base_up">
                        <div class="img_outer">
                            <img src="./imgs/107.jpg" alt="">
                        </div>
                        <div class="good_dsc"><h2>360扫地机器人X95礼盒版</h2>
                        <h3>2650Pa大吸力 清扫省时高效</h3>
                        <p>￥2588<del>￥3688</del></p>
                        </div>
                    </li>
                    <li class="base_up">
                        <div class="img_outer">
                            <img src="./imgs/106.jpg" alt="">
                        </div>
                        <div class="good_dsc"><h2>360扫地机器人X95礼盒版</h2>
                        <h3>2650Pa大吸力 清扫省时高效</h3>
                        <p>￥2588<del>￥3688</del></p>
                        </div>
                    </li>
                    <li class="base_up">
                        <div class="img_outer">
                            <img src="./imgs/108.jpg" alt="">
                        </div>
                        <div class="good_dsc"><h2>360扫地机器人X95礼盒版</h2>
                        <h3>2650Pa大吸力 清扫省时高效</h3>
                        <p>￥2588<del>￥3688</del></p>
                        </div>
                    </li>
                    <li class="base_up">
                        <div class="img_outer">
                            <img src="./imgs/109.jpg" alt="">
                        </div>
                        <div class="good_dsc"><h2>360扫地机器人X95礼盒版</h2>
                        <h3>2650Pa大吸力 清扫省时高效</h3>
                        <p>￥2588<del>￥3688</del></p>
                        </div>
                    </li>
                    <li class="base_up">
                        <div class="img_outer">
                            <img src="./imgs/110.jpg" alt="">
                        </div>
                        <div class="good_dsc"><h2>360扫地机器人X95礼盒版</h2>
                        <h3>2650Pa大吸力 清扫省时高效</h3>
                        <p>￥2588<del>￥3688</del></p>
                        </div>
                    </li>
                </ul>
                <div class="base_img"><img src="./imgs/new02.jpg" alt=""></div>
            </ol>
            <ol class="more_goods">
                <h2 class="base_title">更多商品<i class="iconfont iconright-circle-fill"></i></h2>
                <ul class="clear_fix">
                  <!-- 商品在这里加 -->
                </ul>
                <p class="over">————————<span>别拉了，真的到底了</span>————————</p>
            </ol>
        </div>
    </div>
    <div class="connect">
        <div class="connect_inner main">
            <div class="con_left">
                <ul>
                    <li class="con_item">
                        <h3>关于商城</h3>
                        <p>360商城是奇虎360公司的官方电商平台，主要经营360安全智能设备，以及相关领域消费品。提供最新的360智能设备，最最贴心的售后服务，360社区一手评测资讯，享受360安全、安心、放心的购物体验。</p>
                        <div><span>关于我们</span><span class="iconfont iconweixin1"></span><span class="iconfont iconweibo"></span></div>
                    </li>
                    <li class="con_item">
                        <h3>售后服务</h3>
                        <ul class="con_item_list">
                            <li>7天无理由退货</li>
                            <li>质量问题15天内换货</li>
                            <li>保修条款</li>
                            <li>服务流程</li>
                            <li>许可协议</li>
                            <li>隐私政策</li>
                        </ul>
                    </li>
                    <li class="con_item">
                        <h3>帮助中心</h3>
                        <ul class="con_item_list">
                            <li>用户注册</li>
                            <li>会员说明</li>
                            <li>密码找回</li>
                            <li>购买指南</li>
                            <li>支付方式</li>
                            <li>配送与说明</li>
                        </ul>
                    </li>
                    <li class="con_item">
                        <h3>扫码下载APP</h3>
                        <ul class="con_item_list">
                            <li><img src="./imgs/1.jpg" alt=""></li>
                        </ul>
                    </li>
                </ul>
            </div>
            <div class="con_right">
                <h3>联系我们</h3>
                <ul>
                    <li><span>联系电话：</span><span>400-6822-360</span></li>
                    <li><span>工作时间：</span><span>周一至周日(9:00-18:00)</span></li>
                    <li><span>公司地址：</span><span>北京市朝阳区酒仙桥路6号院2号楼1至17层
                        102号内5层50
                        </span></li>
                    
                </ul>
            </div>
        </div>
    </div>
    <div class="footer">
        <div class="footer_inner main">
            <p>公司名称:北京视觉世界科技有限公司&nbsp;|&nbsp;社会统一信用代码:91110105336460203N &nbsp;|&nbsp;食品经营许可证</p>
            <p>2019-2021 mall.360.cn版权所有&nbsp;|&nbsp;京ICP备08010314号-43&nbsp;|&nbsp;营业执照京公网安备11000002000006号</p>
        </div>
        
    </div>
    <div class="right_nav">
        <li class="right_nav_item"><i class="iconfont iconxinxi" title="意见反馈"></i></li>
        <li class="right_nav_item"><i class="iconfont iconweixin" title="微信公众号"></i></li>
        <li class="right_nav_item"><i class="iconfont iconkefu" title="在线客服"></i></li>
        <li class="right_nav_item last"><i class="iconfont iconfanhui1" title="返回上一页" id="last"></i></li>
        <li class="right_nav_item"><i class="iconfont iconfanhuidingbu" title="返回顶部" id="back"></i></li>
    </div>
    <div class="left_nav">
        <li id="catalist_all" class="left_nav_item">
            <a href="javascript:void(0);">全部分类</a>
          </li>
        <li id="activity" class="left_nav_item">
            <a href="javascript:void(0);">热门活动</a>
          </li>
          <li id="spike" class="left_nav_item">
            <a href="javascript:void(0);">限时秒杀</a>
          </li>
          <li id="sweep" class="left_nav_item">
            <a href="javascript:void(0);">扫地机器人</a>
          </li>
          <li id="inter" class="left_nav_item">
            <a href="javascript:void(0);">智能互联</a>
          </li>
          <li id="home" class="left_nav_item">
            <a href="javascript:void(0);">家庭安防</a>
          </li>
          <li id="car" class="left_nav_item">
            <a href="javascript:void(0);">行车安全</a>
          </li>
          <li id="more_goods" class="left_nav_item">
            <a href="javascript:void(0);">更多商品</a>
          </li>
    </div>
</body>
<script type="text/javascript" data-main="./js/index" src="./lib/require.js"></script>
<!-- <script src="./lib/jquery.min.js"></script>
<script src="./lib/swiper.js"></script>
<script src="./js/index.js"></script> -->
</html>